@charset "uft-8";
/* CSS Document */
html,body{width: 100%; height: 100%; }
html{-ms-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none;-webkit-tap-highlight-color:rgba(0,0,0,0);}
body, h1, h2, h3, h4, h5, h6, hr, p,blockquote,dl, dt, dd, ul, ol, li,pre,form, fieldset, legend, button, input, textarea, th, td, img{border:medium none;margin: 0;padding: 0;list-style-type: none;}
body,button, input, select, textarea { font-family:  '微软雅黑',tahoma, Srial, helvetica, sans-serif;}

em{font-style:normal; } 
ul, ol,{ list-style:none;}
a,a:hover{text-decoration: none;}
img{ border:0px;}
body,.ui-overlay-h{margin:0 auto; position:relative;}
input, img{vertical-align: middle;}
body,html{margin:0 auto; height: 100%;}
img{width: 100%; display:table; border:none; vertical-align:top;}
*{margin:0;padding:0;text-shadow:none;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;}
.clearfix:after,.clear:before{display:table;content:'';}
.clearfix:after{clear:both;	overflow:hidden;}
.clearfix{zoom:1;}

.header_zt{width: 100%; height: 1.70666667rem;}
body,.hm-contaier{min-width:320px; max-width:750px; width: 100%; overflow-x:hidden; margin:0 auto; clear:both;  background-color: #fff;}
.hm-box{width:100%; height: auto; float: left;}
.hm-wrap{width: 9.6rem; margin: 0 auto; clear: both;}
.contaier img{width: 100%; display: block;}
.contaier .m-Box{ width: 100%; float: left; }
.contaier .m-Wrapper{width: 9.2rem; margin: 0 auto;}


.header{width: 100%;float: left;}
.header .logo{display: block;float: left;}
.header .header_nav{width: 100%;position: relative;float: left;padding: 0 0.26666667rem;background-color: #a06fb1;}
.header .header_nav a{width: auto;display: table;float: left;padding: 0 0.44rem;font-size: 0.34666667rem;line-height: 0.8rem;text-align: center;color: #fff;}
.header .header_nav .mbtn {width: 0.50666667rem;height: 0.34666667rem;float: right;background: url('http://images.ubeauty.cn/mobile/2020_zh/images/head_menu.png') no-repeat center top / 100%;margin-top: 0.24rem;padding: 0;}

.popMenus{width: 100%;height:100%; display: table; position: absolute; left: 0; top: 0; opacity: 0; background-color: #3f4754; overflow: hidden; -moz-transition:all .6s ease-out 0s;-webkit-transition:all .6s ease-out 0s;transition:all .6s ease-out 0s;-moz-transform:translateX(-100%);-webkit-transform:translateX(-100%);-ms-transform:translateX(-100%);-o-transform:translateX(-100%);transform:translateX(-100%); z-index:1000}
.popMenus.show{-webkit-transform:translateX(0);transform:translateX(0); opacity: 1;}

.pop_title{width: 100%; position: relative; display: table; z-index: 2; background-color: #2e3642; padding: 0 3%; }
.pop_title span{display: inline-block;float: left;font-size: .48rem;line-height: 1.2rem;color: #60656f;}
.closePopMenu{display: block; width: .65333333rem; height: .62666667rem;right: 3%;top: 50%;position: absolute;-webkit-transform: translateY(-50%); transform: translateY(-50%);}
.menuContainer{width: 100%; height: 100%; }
.menuNavs{width: 25%; background-color: #2e3642; height: 100%; float: left; overflow: hidden; position: relative; }
.menuNavs ul{ position: absolute;width:100%; -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-transform: translateZ(0); transform: translateZ(0); padding-bottom:1.06666667rem;}
.menuNavs ul li {width: 100%;font-size: .37333333rem;line-height: 1rem;padding-left: 9%;}
.menuNavs ul li.on { background-color:#3f4754;}
.menuNavs ul a { display: block; width: 100%; height: 100%; color: #fff; }
.menuContents {width:75%; height:100%;float:left; padding:0 7%;}
.menuContent {width:100%;height:100%;overflow:hidden;}
.menuLists {padding-bottom:1.06666667rem;}
.menuList h4 {font-size: .32rem;color:#fff;line-height: 1rem;border-bottom:1px solid #525c6b;margin-top:2%;font-weight:normal;}
.menuList .links {padding:3% 0.5%;}
.menuList .links a{display:table;float:left;color:#a9a9a9;font-size: .32rem;line-height: .8rem;padding-right: 4%;overflow:hidden;}
.menuList .links a.hot:after {content:'';position:absolute;width:.12rem;height:.14666667rem;top:0;right:-1px;}
.menuList .links a.hot.active:after {-webkit-animation:shake .4s linear 0s 1;animation:shake .4s linear 0s 1;}




.banner .swiper-container,.banner .swiper-container .swiper-slide{ height: auto;margin-bottom: -16px;}
.banner .swiper-pagination{ bottom: -.13333333rem}
.banner .swiper-pagination-bullet{ width: .18666667rem; height: .18666667rem; border-radius: 50%; background:#000; margin: 0 .08rem; opacity: 0.2;}
.banner .swiper-pagination-bullet-active{ width: .53333333rem; border-radius: .09333333rem; background-color: #da006d; opacity: 1;}



.footer {
  height: 12.36666667rem;
  background: url('../images/footer-bg.jpg') no-repeat left top / 100%;
}
.footer .bt {
  width: 100%;
  float: left;
  padding: 1.14666667rem 0 0.61333333rem 0.53333333rem;
}
.footer .bt h3 {
  font-size: 0.61333333rem;
  line-height: 0.74666667rem;
  color: #fc2877;
}
.footer .bt p {
  font-size: 0.4rem;
  line-height: 0.53333333rem;
  color: #817a7b;
}
.footer .text {
  width: 100%;
  float: left;
  margin-bottom: 3.06666667rem;
}
.footer .text li {
  width: 100%;
  float: left;
  margin-bottom: 0.4rem;
  padding-left: 0.66666667rem;
}
.footer .text li p {
  font-size: 0.34666667rem;
  line-height: 0.48rem;
}
.footer .text li b {
  font-size: 0.4rem;
  line-height: 0.53333333rem;
  display: block;
}
.footer .text li:nth-child(1) {
  background: url('../images/footer-i1.png') no-repeat left top / 0.56rem;
}
.footer .text li:nth-child(2) {
  background: url('../images/footer-i2.png') no-repeat left top / 0.56rem;
}
.footer .bah {
  width: 100%;
  float: left;
  padding-top: 0.15em;
}
.footer .bah p {
  font-size: 0.29333333rem;
  line-height: 0.42666667rem;
  text-align: center;
  color: #333333;
}

@media screen and (min-width:0px) and (max-width:319px) {
    html{font-size:12px;}
}
@media screen and (min-width:320px) and (max-width:479px) {
    html{font-size:16px;}
}
@media screen and (min-width:480px) and (max-width:639px) {
    html{font-size:24px;}
}
@media screen and (min-width:750px){
    html{font-size:75px;}
}